<template>
  <div class="title-area">
    <h1>Welcome to Word Association</h1>
    <h3>
      your score is:<span id="score-display">{{ scoreDisplay }}</span>
    </h3>
  </div>
</template>

<script>
import bus from "../utils/bus"
export default {
  name: "Title",
  data() {
    return {
      scoreDisplay: 0,
    }
  },
  created() {
    bus.$on("scoreHandler", (score) => {
      this.scoreDisplay = score
    })
  },
}
</script>

<style scoped></style>
